<template> 
		<uni-card   :title="`单号:${info.orderId}`" :extra="status">
			<view class="w-full flex">
				<view class="item">
					货物类型：{{info.cargoType}}
				</view>
				<view>
					时效：{{info.flightTimeEffectiveness}}
				</view>
			</view>
			<view class="w-full flex">
				<view class="item">
					实付费用：{{info.dueFee}}
				</view>
				<view>
					<!-- 0: 1: 2: -->
					支付方式：
					<text v-if="info.paymentMethod  === 0">余额支付</text>
					<text v-if="info.paymentMethod  === 1">微信支付</text>
					<text v-if="info.paymentMethod  === 2">支付宝支付</text>
				</view>
			</view>
			<view class="w-full flex">
				<view class="item">
					联系人：{{info.recipient}}
				</view>
				<view>
					联系电话：{{info.mobilePhone}}
				</view>
			</view>
			<view class="w-full ">
				<view>
					下单时间：{{info.createTime}}
				</view>
			</view>
			<view class="w-full ">
				<view>
					收货地址：  {{info.address}}
				</view>
			</view>
			<view class=" flex mt-2   flex-row-reverse w-full ">
				<uv-button type="error " @click="$emit('getOrderDetails',info.orderId)"  class="ml-6"  shape="square" :custom-style="customStyle" :plain="true" text="订单详情"
					size="mini"></uv-button>
				<uv-button type="error "  shape="square" :custom-style="customStyle" :plain="true" text="物流跟踪"
					size="mini"></uv-button>
			</view>
		</uni-card> 
</template> 

<script setup> 
  
const props = 	defineProps({
		info:{
			type:Object,
			default:{
				orderId:''
			}
		},
		flag:{
			type:Number,
			default:0
		}
	}) 
const customStyle = computed(()=>{
	return {
		width: '100rpx',
		height: '50rpx',
		color: '#f56c6c',
		borderRadius: '25rpx', //圆角  
	}
}) 
 
 const status = computed(()=>{
	 if(props.flag === 0){
		return props.info.payStatus ? '已付款' : '待付款'
	 }
	 if(props.flag === 1){
		 return props.info.transferStatus ? '已发货' : '待发货'
	 }
	 if(props.flag === 2){
		 	 return props.info.isSign ? '已签收' : '待签收'
	 }
	 else{
		 if(props.info.payStatus){
			 if(props.info.transferStatus){
				 if(props.info.isSign){
					 return '已签收'
				 }else{
					 return '未签收'
				 }
			 }else{
				 return '待发货'
			 }
		 }else{
			 return '待付款'
		 }
	 }
 })
 
</script>

<style lang="scss" scoped>
	::v-deep .uni-card .uni-card__header .uni-card__header-extra .uni-card__header-extra-text {
		color: #6699ff !important;
	}

	.uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title {
		font-weight: 700;
	}

	::v-deep.uni-card {
		margin: 4px !important;
	}

	.item {
		width: 50%; 
	}
	view{
		
			font-size: 12px; 
	}

	//每一行的样式 
</style>


s